<!DOCTYPE html>

<head>
    <meta charset="UTF-8">
    <html lang="en" xmlns:th="http://www.thymeleaf.org">

    </html>
    <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0" />
    <title id="title-meta">安捷能源</title>
    <link rel="stylesheet" th:href="@{/css/normalize.css}">
    <link rel="stylesheet" th:href="@{/css/gongkuangmodify.css}">
    <link rel="stylesheet" th:href="@{/css/keyboard.css}">
    <link th:href="@{/css/jquery-ui.css}" rel="stylesheet">
    <!-- 引入样式 -->
    <link rel="stylesheet" type="text/css" th:href="@{/js/elementui/theme-chalk/index.css}"/>
    <style>

    </style>
</head>

<body>
    <div class="app" id="app" v-cloak>
        <div class="top">
            <div class="top-title">工况调节中心</div>
        </div>
        <div class="body">
            <div class="control-center">
                <div class="graph-select">
                    <div class="title-select">
                        选择图谱:
                    </div>
                    <div class="gongkuang-item">
                        <el-select v-model="value" placeholder="请选择" size="mini">
                            <el-option v-for="item in options" :key="item.value" :label="item.label"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </div>
                </div>
                <div class="gongkuang-select">
                    <div class="title-select">调节条件: </div>
                    <div class="gongkuang-item">
                        <el-select v-model="value" placeholder="工况选择" size="mini">
                            <el-option v-for="item in options" :key="item.value" :label="item.label"
                                :value="item.value">
                            </el-option>
                        </el-select>
                    </div>
                    <div class="multi-condition-group">
                        <div class="multi-condition">
                            <el-select v-model="value" placeholder="条件1" size="mini">
                                <el-option v-for="item in options" :key="item.value" :label="item.label"
                                    :value="item.value">
                                </el-option>
                            </el-select>
                            <el-select v-model="value" placeholder="请选择" size="mini" class="small">
                                <el-option v-for="item in options" :key="item.value" :label="item.label"
                                    :value="item.value">
                                </el-option>
                            </el-select>
                            <div class="middle">
                                <el-input v-model="input" placeholder="请输入内容" size="mini"></el-input>
                            </div>
                        </div>
                        <div class="add-one-add">
                            <div>
                                <el-button type="danger" icon="el-icon-plus" circle></el-button>
                            </div>
                            <div class="title-select">
                                增加条件
                            </div>
                        </div>

                    </div>

                    <div class="last-condition">
                        <el-select v-model="value" placeholder="条件2" size="mini" class="small">
                            <el-option v-for="item in options" :key="item.value" :label="item.label"
                                :value="item.value">
                            </el-option>
                        </el-select>
                        <div class="middle">
                            <el-input v-model="input" placeholder="请输入内容" size="mini"></el-input>
                        </div>

                    </div>
                </div>
            </div>
            <div class="add-one">
                <!-- <div>
                    <el-button type="danger" icon="el-icon-plus" circle></el-button>
                </div>
                <div class="title-select">
                    增加调节
                </div> -->
                <el-button type="success">增加调节</el-button>
            </div>

        </div>

    </div>

    <script th:src="@{/js/jquery-1.9.1.min.js}"></script>
    <script th:src="@{/js/echarts.min.js}"></script>
    <script th:src="@{/js/time.js}"></script>
    <script th:src="@{/layer/layer.js}"></script>
    <script th:src="@{/js/jquery.blockUI.js}"></script>
    <script th:src="@{/js/tools.js}"></script>
    <script th:inline="javascript" th:src="@{/js/vue.min.js}"></script>

    <script th:src="@{/js/detect-element-resize.js}"></script>
    <script th:src="@{/js/iframe-resize.js}"></script>
    <script th:src="@{/js/elementui/index.js}"></script>
    <script>
        var vm = new Vue({
            el: '#app',
            data: {
                options: [{
                    value: '选项1',
                    label: '黄金糕'
                }, {
                    value: '选项2',
                    label: '双皮奶'
                }, {
                    value: '选项3',
                    label: '蚵仔煎'
                }, {
                    value: '选项4',
                    label: '龙须面'
                }, {
                    value: '选项5',
                    label: '北京烤鸭'
                }],
                value: ''
            },
            methods: {
            }
        });
    </script>

</body>

</html>